<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>软著登录产品管理系统</title>
	</head>
	<link rel="stylesheet" href="css/common.css" />
	<style>
		body{
			background: #f8f8f8;			
		}
		.box input[type=text],.box input[type=password]{
			width: 270px;
			height: 42px;
			box-shadow:0 0 5px #e4e4e4;
			
		}
		input[type=password]:hover{
			border-color:#47abff;
		}
		input[type=text]:hover{
			border-color:#47abff;
		}
		
		#loginBox{
			
			height: 260px;
			position:fixed;
			left:0;
			top:0;
			bottom: 0;
			right:0;
			margin:auto;
			
		}
		.box{
			margin: 0 auto;
			width:280px;
			height:260px;	
		}
		.box p:nth-of-type(1){
			height:49px;
			margin-bottom:37px;
			background:url(img/login_filght.jpg) no-repeat center center;
		}
		.box p:nth-of-type(2){
			height:42px;			
		}
		.box p:nth-of-type(3){
			
			height:42px;			
		}
		
		.box p:nth-of-type(4){
			height:42px;	
			margin-top:19px;		
		}

		.box p:nth-of-type(5) span{
			display: inline-block;
			cursor: pointer;
			line-height: 40px;
		}		
		.forgetPass{
			float:right;
			color: #47abff;
		}
		button{
			width:100%;
			border: none;
			height:32px;
			background: #0188cc;
			cursor: pointer;
			font-size: 14px;
			color: white;
			font-family: "微软雅黑";
			outline: none;
		}
		input[type=text],input[type=password] {
  			width: 110px;
  			font-family: "微软雅黑";
  			height: 42px;
  			border: 1px solid #bfc2c8;
 			outline: none;
  			padding-left: 10px;
  			border-radius: 1px;
  			background:white;
			}
		
		input[type=checkbox]{
			position:relative;
			top:3px;
			background:white;
			border:1px solid #bfc2c8;
			}
	</style>
	<script type="text/javascript" src="js/jquery-1.12.4.js" ></script>
	<script type="text/javascript" src="js/resourceList.js" ></script>
	<script type="text/javascript" src="layer-v2.4/layer/layer.js" ></script>
	<script type="text/javascript">
	
	</script>	
	<body>
	<!--  	
		<header>
			1123ddd
			</header>
			<section>
				<div class='content'>
					<div class='winRegister'>
						<p class='userLogin'>用户登录</br><span style='font-size: 14px;'>USER LOGIN</span></p>
						<input class='user' type='text' placeholder="请输入用户名"/>
						<input class='pw' type='password' placeholder="请输入密码"/>
						
						<p class='choose'><span><input class='remenber' type='checkbox'/></span>&nbsp;&nbsp;<span class='remPassword'>记住密码</span>&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;<span class='forPassword'>忘记密码？</span></p>
						<button class='login'>登录</button>
					</div>
				</div>
			</section>
			<footer>
				<p>aaa版权所有&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 天津伊翔运达网络科技有限公司&nbsp;&nbsp;&nbsp; 2017</p>
			</footer>	--> 
			
	  	<div id="loginBox">
			<div class="box">
				<p></p>
				<p><input class="userName user" type="text" placeholder="用户名"/></p>
				<p><input class="passWord pw" type="password" placeholder="密码"/></p>
				<p><button class="submit login">登录</button></p>
				<p><input class="checkPass remenber" type="checkbox"/> <span class="remPass remPassword">记住密码</span><span class="forgetPass forPassword">忘记密码? </span></p>
			</div>
		</div>  
	</body>
	
	<script>
	var url = document.location.href.toString();
	var u = url.split("=");
	 
			if(getCookie('username')){
			 	$(".user").val(getCookie('username'))
			 	$(".remenber").prop("checked",true)	
			}
			if(getCookie('password')){
				$(".pw").val(getCookie('password'))
			}
			
			
			//________________________________________________________鼠标离开判断用户名
			$(".user").blur(function(){
				if($(".user").val()==""){							
					layer.msg("用户名不能为空！",{icon:2,time:2000})
					return false;
				}
				if($(".user").val()==getCookie('username')){
					$(".pw").val(getCookie('password'))					
				}else{
					$(".pw").val("")
				}
			})			
	
	
	//________________________________________________________点击文字选中复选框
		$(".remPassword").click(function(){
			if(!$(".remenber").is(':checked')){
				$(".remenber").prop("checked",true)			
			}else{
				$(".remenber").prop("checked",false)
			}			
		})
	//________________________________________________________点击登录
		$(".login").click(function(){
			login()			
		})
		document.onkeydown = function(ev){
			ev = ev||event
			if(ev.keyCode=="13"){
				login()
			}
		}
		function login(){
				
				var loginMess = {};
				var user = $('.user').val();
				var pw = $('.pw').val();
				
				if($(".user").val()==""){
					layer.msg("用户名不能为空！",{icon:2,time:2000})
					return false;
				}
				if($(".pw").val()==""){
					layer.msg("密码不能为空！",{icon:2,time:2000});
					return false;
				}else{
					if($(".remenber").is(':checked')){
						setCookie('username',user,12);
						setCookie('password',pw,12)
					}else{
						//removeCookie('username');
						removeCookie('password');
					}
					loginMess = {
							"loginname":user,
							"password":pw
						}
					$.ajax({
						type:"post",
						url:"api/login?temp="+Math.random(),
						contentType:'application/json;charset=utf-8',
						async:false,
						data:JSON.stringify(loginMess),
						success:function(data){
							data = JSON.parse(data);							
							if(data.status=="1001"){
								window.location = "index?to="+u[1];
							}else{							
								layer.msg("请输入正确的用户名和密码！",{icon:2,time:2000})
								return false;
							}
															
						}			
					});	
				}
			}
		
//________________________________________________________________________________________忘记密码
   		$(".forPassword").click(function(){
   			layer.msg("请联系管理员重置密码！",{icon:5,time:2000})
   		})
			 
			 
			 
			 
			//设置cookie 
			function setCookie(key,value,t){
				var oDate=new Date();
				oDate.setDate(oDate.getDate()+t);
				document.cookie=key+"="+encodeURI(value)+";expires="+oDate.toGMTString();
			}
			//移除cookie
			function removeCookie(key){
				setCookie(key,"",-10);
			}
			//获取cookie
			function getCookie(key){
				var arr=document.cookie.split("; ");
				for(var i=0;i<arr.length;i++){
					var newArr=arr[i].split("=");
					if(newArr[0]==key){
						return decodeURI(newArr[1]);
					}					
				};
				return false;
			}
	</script>
</html>
